<template>
    
    <!-- 组件的模板 -->
    <div class="city-select">
        <div class="weui-cells" v-if="isshow">
            <a class="weui-cell weui-cell_access" href="javascript:;" @click="gotoCityList(pid,pname)">
                <div class="weui-cell__bd">
                    <p>{{showname}}</p>
                </div>
                <div class="weui-cell__ft">已选地区</div>
            </a>            
        </div>        
        <div class="weui-cells">            
            <a class="weui-cell weui-cell_access" href="javascript:;" 
                v-for="item in provinceArr"
                :id="item.province_id"
                @click="gotoCityList(item.province_id,item.short_name)"
                >
                <div class="weui-cell__bd">
                    <p>{{item.short_name}}</p>
                </div>
                <div class="weui-cell__ft"></div>
            </a>
        </div>
    </div>
        
</template>

<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import * as util from 'js/util.js'
    import widget from 'gapi/widget.js'
    import cache from 'gapi/cache.js'
    import commonPage from 'clientApi/commonPage.js'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */

    /**
     *  组件实例对象
     */
    export default {
        components: {

        },
        data: function(){
            return{
                isshow:false,
                showname:'',
                pid:'',
                cid:'',
                did:'',
                pname:'',
                cname:'',
                dname:'',
                provinceArr:[]
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                // 获取缓存里的数据
                cache.getCache('addressArrData', (data) => {
                    if(data){
                        if(data.key.province_id !=0 || data.key.city_id !=0 || data.key.district_id !=0){
                           this.isshow = true
                            if(data.value.province_name == data.value.city_name){
                                this.showname = data.value.city_name
                            }else{
                                this.showname = data.value.province_name
                            }
                            this.cname = data.value.city_name
                            this.pname = data.value.province_name
                            this.cid = data.key.city_id
                            this.pid = data.key.province_id 
                        }else{
                            this.isshow = false
                        }
                    }else{ 
                       this.isshow = false 
                    }
                })
            },
            // 前往市列表页
            gotoCityList (province_id,province_name){
                let encodeStr = encodeURIComponent(`province_id=${province_id}&province_name=${province_name}`)
                location.href = `dmsaas://SelectMunicipality?urdData=${encodeStr}`
            }
        },
        created(){
            /*获取地区下拉选择列表，存放在缓存里*/ 
            commonPage.loadPageStatus('loading')
            /*获取地区下拉选择列表，存放在缓存里*/ 
            util.ajax({
                url:'/common/geography/get',
                type:'GET',
                data:{
                    team_id:0,
                    project_id:0
                },
                timeout:10000,
                success:(obj) => {
                    commonPage.loadPageStatus('loadSuccess')
                    if(obj.errno == 0){
                        this.provinceArr = obj.data
                        localStorage.setItem("localityData",JSON.stringify(obj.data))                                                 
                    }else{
                        widget.toast(obj.errmsg)
                    }
                },
                error: (xhr, status) => {
                    commonPage.loadPageStatus('loadSuccess')
                    widget.toast('服务器异常')
                },
                noNetwork: () => {
                    commonPage.loadPageStatus('loadSuccess')
                    widget.toast('网络连接失败，请检查网络')
                }
            })
            
            this.init();
            
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>



